<template>
  <div class="home">

    <!-- 二级路由占位符 -->
    <router-view />

    <van-tabbar v-model="active" route>
      <van-tabbar-item icon="home-o" replace to="/home/index">首页</van-tabbar-item>
      <van-tabbar-item icon="search" replace to="/home/toplist">榜单</van-tabbar-item>
      <van-tabbar-item icon="like-o" repalce to="/home/echarts">爱好</van-tabbar-item>
      <van-tabbar-item icon="user-o" repalce to="/home/myuser">我的</van-tabbar-item>
    </van-tabbar>

  </div>
</template>
<script>

import HelloWorld from '@/components/HelloWorld.vue'
export default {
  data() {
    return {
      active: 0
    }
  },
  name: 'HomeView',
  components: {
    HelloWorld
  }
}
</script>
<style>

#app > div > div.van-hairline--top-bottom.van-tabbar.van-tabbar--fixed{
  z-index: 20;

}
</style>
